{extend name="iframe" /}
{block name="css"}
{css href="__CSS__/h5.css" /}
{/block}
{block name="body"}
<!-- 主要内容 开始 -->
<div class="weui-tab__bd-item">
    <div class="weui-header-warp">
        <div class="swap"></div>
        <img src="__IMG__/bg_index.png" class="weui-header-img" alt="顶部图片">
    </div>
    <!--快捷菜单-->
    <div class="swiper-menu">
        <div class="swiper-wrapper">
            {volist name="$data.menu" id="v"}
            <div class="swiper-slide">
                <div data-code="{$v.url|default=''}" class="menu-grid">
                    <img src="{$v.img|default=''}" />
                    <p>{$v.name|default=''}</p>
                </div>
            </div>
            {/volist}
        </div>
        <div class="swiper-menu-pagination"></div>
    </div>
    <!--轮播图-->
    <div class="swiper-container">
        <div class="swiper-wrapper">
            {volist name="$data.banner" id="v"}
            <div class="swiper-slide banner-main" data-code="{$v.url|default=''}">
                <img src="{$v.img|default=''}"  alt="{$v.name|default=''}"/>
            </div>
            {/volist}
        </div>
        <div class="swiper-pagination"></div>
    </div>
    <!--会员专区-->
    <div class="weui-flex">
        <div class="weui-flex-box">
            <h2>会员专区</h2>
        </div>
    </div>
    <div class="weui-server-wrap">
        {volist name="$data.server" id="v"}
        <div class="weui-server-item" data-code="">
            <div class="weui-server-text">
                <div class="weui-server-title">{$v.name|default=''}</div>
                <div class="weui-server-desc">{$v.desc|default=''}</div>
            </div>
            <div class="weui-server-image">
                <img src="{$v.img|default=''}">
            </div>
        </div>
        {/volist}
    </div>
    <!--首页推荐分类-->
    {volist name="cate_goods" id="v"}
        {notempty name="$v.id"}
        <!--会员专区-->
        <div class="weui-flex">
            <div class="weui-flex-box">
                <h2>{$v.name}</h2>
            </div>
        </div>
        <div class="weui-header-warp">
            <img src="{$v.img|default='__IMG__/optimization-img2.jpg'}" class="weui-header-img" style="border-radius: 100px" alt="{$v.name|default=''}">
        </div>
        <div class="weui-list-theme-box weui-list-theme-two">
        {volist name="$v.id" id="v" empty="$empty"}
            <div class="weui-list-item good" data-code="{$v.id}">
                <div class="weui-list-theme-img">
                    <img src="{$v.img.0|default=''}" alt="{$v.name|default=''}">
                </div>
                <div class="weui-list-theme-message">
                    <h3 class="weui-list-theme-title">{$v.name|default=''}</h3>
                    <span>
                        <em>￥</em>
                        {$v.shop_price|substr=0,-3}
                        <i>{$v.shop_price|substr=-3,3}</i>
                        <em class="line">￥{$v.market_price|default=0}</em>
                    </span>
                </div>
            </div>
        {/volist}
        </div>
        {/notempty}
    {/volist}
    <!--推荐列表-->
    <div class="weui-sol-list">
        <div class="weui-flex">
            <div class="weui-flex-box">
                <h2>为您推荐</h2>
            </div>
        </div>
        <div class="weui-list-theme-box weui-list-theme-two">
            {volist name="$data.goods" id="v"}
            <div class="weui-list-item good" data-code="{$v.id}">
                <div class="weui-list-theme-img">
                  <img src="{$v.img.0|default=''}" alt="{$v.name}">
                </div>
                <div class="weui-list-theme-message">
                    <h3 class="weui-list-theme-title">{$v.name}</h3>
                    <span><em>￥</em>{$v.shop_price|substr=0,-3}<i>{$v.shop_price|substr=-3,3}</i> <em class="line">￥{$v.market_price}</em></span>
                </div>
            </div>
            {/volist}
        </div>
    </div>
    <div class="divFooter"></div>
</div>
<!-- 主要内容 结束 -->
{/block}
{block name="js"}
{js href="__LIB__/js/swiper.js,__LIB__/js/swiper.min.js" /}
<script type="text/javascript">
    $(function(){
        if (is_weixin()) {
            $.post('weconfig.html',{curl:"{$Request.action}"},function(result){
                var res = $.parseJSON(result);
                wx.config({
                    appId: res.appId,
                    timestamp:res.timestamp,
                    nonceStr: res.nonceStr,
                    signature: res.signature,
                    jsApiList: res.jsApiList
                });
                wx.checkJsApi({
                  jsApiList: ['getLocation'],
                    success: function (res) {
                        if (res.checkResult.getLocation == false) {
                            $.toast('你的微信版本太低，不支持微信JS接口，请升级到最新的微信版本！','text');
                        }
                    },
                    fail: function (res) {
                        $.toast('checkJsApi fail=' + JSON.stringify(res),'text')
                    }
                });
                wx.ready(function () {
                    wx.getLocation({
                        type: "gcj02",
                        success: function (res) {
                            var latitude = res.latitude; // 纬度，浮点数，范围为90 ~ -90
                            var longitude = res.longitude; // 经度，浮点数，范围为180 ~ -180。
                            $.post('addr.html',{lat:res.latitude,lon:res.longitude},function(res){
                                $("#city").html(res.msg);
                            });
                        }
                    });
                });
            });
        }

        //消息通知
        // $.noti({
        //     text: "<center>&copy; 2021 牛转乾坤</center>"
        // });
        //微信、APP内显示扫一扫
        (jsBridge.inApp || is_weixin()) && $(".scan").show();
        $('.scan').click(function(){
            if(is_weixin()){
                wx.scanQRCode();
            }else{
                jsBridge.scan();
            }
        });

        //消息通知
        $(".notice").click(function(){
            $.post('notic.html',function(res){
                if (res.code !== 1) {
                    $.toast(res.msg,'text');
                }else{
                    $.alert(res.data.content, res.data.name);
                }
            });
        });

        //轮播图
        $(".swiper-container").swiper({
            loop: true,
            slidesPerView: 1,
            pagination: {
                el: '.swiper-pagination',
            },
            autoplay: {
                delay: 3000,
                disableOnInteraction: false,
            },
        });
        //快捷菜单
        $(".swiper-menu").swiper({
            slidesPerView: 5,
            pagination: {
                el: '.swiper-menu-pagination',
                type: 'progressbar',
            },
            autoplay: {
                delay: 2000,
                disableOnInteraction: false,
            },
        });

        //商品详情
        $('.good').click(function(){
            var url = $(this).data('code');
            $(location).attr('href', 'good/type/'+url+'.html');
        });
        //菜单
        $('.menu-grid,.list-main,.banner-main,.weui-server-item').click(function(){
            var url = $(this).data('code');
            if(!url) return $.toast('开发中','text');
            if(url.indexOf("http") != -1) return $(location).attr('href', url);
            $(location).attr('href', '/'+url+'.html');
        });
    });
</script>
{/block}